<template>
	<view>
		<view class="curMainAccount">
			<view>当前主账户</view>
			<view>
				{{curMainAccount == ''?'空':curMainAccount}}
			</view>
		</view>
		<view class="SubAccount">
			<view class="SubAccountTitle">
				相同身份证手机号关联子账号，请选择要合成的子账号
			</view>
			<view class="subAccountList">
				<checkbox-group @change="checkboxChange">
					<view v-for="(ele,ind) in options" :key="ind">
						<checkbox :value="ele.value" color="#FFCC33" :checked="SubAccountValue.includes(ele.value)" />
						<text style="margin-left:20rpx;">{{ele.label}}</text>
					</view>
				</checkbox-group>
			</view>
		</view>
		<view class="submitButton" @click="saveFun">
			一键合成奖励积分至主账号
		</view>
		<uni-popup ref="popup" type="bottom">
			<view class="popupBox">
				<view class="popupBoxTitle">支付密码</view>
				<view>
					<input v-model="payPassword" type="password" placeholder="请输入支付密码" />
				</view>
				<view class="modifyBnt" @click="payOrderSubmitFunc">合成</view>
			</view>
		</uni-popup>	
	</view>
</template>

<script>
	import {
		getSameTransferMemberList,
		setOneKeyTransferSubmit
	} from '@/api/directSelling.js'
	export default {
		data() {
			return {
				curMainAccount: '',
				MainAccountValue: '',
				SubAccountValue: [],
				options: [],
				payPassword:""
			}
		},
		created() {
			uni.showLoading({
				title: '查询中',
				mask: true
			});
			this.getSameTransferMemberList();
		},
		methods: {
			getSameTransferMemberList() {
				getSameTransferMemberList().then(res => {
					let data = res.data;
					uni.hideLoading();
					data.forEach(i => {
						if (i.QQ == "1") { //主账户
							this.curMainAccount = i.MEMBER_CODE + ' -  积分: ' + new Number(i.BONUS_ACCOUNT)
								.toFixed(2);
							this.MainAccountValue = i.MEMBER_ID + '';
						}
						if (i.QQ == "2") { //子账号
							let accountInfo = {
								label: i.MEMBER_CODE + '-' + i.REAL_NAME + ' -  积分: ' + new Number(i
									.BONUS_ACCOUNT).toFixed(2),
								value: i.MEMBER_ID + '',
								disabled: i.QQ == '1' ? true : false
							};
							this.options.push(accountInfo);
							this.SubAccountValue.push(i.MEMBER_ID + '');
						}
					})
				}).catch(err => {
					console.log(err);
				})
			},
			checkboxChange(e){
				this.SubAccountValue=e.detail.value;
			},
			//确认按钮
			saveFun(){
				if(this.curMainAccount == null || this.curMainAccount ==''){
				  this.$util.Tips({
				  	title: '请先设置主账号！'
				  });
				  return;
				}
				if(this.SubAccountValue.length==0){
					this.$util.Tips({
						title: '请选择要合成的子账号！'
					});
					return;
				}
				this.$refs.popup.open();
			},
			//开始合成
			payOrderSubmitFunc(){
				uni.showLoading({
					title: '开始合成',
					mask: true
				});
				setOneKeyTransferSubmit({
					"subMemberIds" : this.SubAccountValue,
					"payPassword": this.payPassword,
				}).then(res=>{
					if(res.meta.success==true){
						uni.hideLoading();
						this.$util.Tips({
							title: '操作成功！'
						});
						setTimeout(()=>{
							uni.navigateTo({
								url: "/pages/electronicWallet/electronicWallet/index"
							});
						},2000)
					}
					
				}).catch(err=>{
					uni.hideLoading();
				})
			}
		}
	}
</script>

<style lang="scss">
	body,
	page {
		padding: 30rpx 30rpx;
		box-sizing: border-box;
		background: #fff;
	}

	.curMainAccount {
		height: 100rpx;
		line-height: 100rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		border: 1px solid #d9d9d9;
		border-left: none;
		border-right: none;
		padding: 0 20rpx;
		box-sizing: border-box;

		>view:nth-child(1) {
			font-size: 32rpx;
			color: #000;
		}

		>view:nth-child(2) {
			color: forestgreen;
			font-weight: bold;
			font-size: large;
		}
	}

	.SubAccount {
		padding: 10rpx 40rpx;
		box-sizing: border-box;

		.SubAccountTitle {
			height: 80rpx;
			line-height: 80rpx;
			font-size: 24rpx;
			border-bottom: 1px solid #d9d9d9;
		}

		.subAccountList {
			padding: 0 25rpx;
			box-sizing: border-box;

			view {
				height: 120rpx;
				line-height: 120rpx;
				font-size: 28rpx;
				border-bottom: 1px solid #d9d9d9;
			}
		}
	}

	.submitButton {
		width: 90%;
		height: 90rpx;
		line-height: 90rpx;
		text-align: center;
		background: $theme-color;
		border-radius: 50rpx;
		color: #fff;
		margin: 100rpx auto;
	}
	.modifyBnt {
		font-size: 32rpx;
		color: #fff;
		width: 700rpx;
		height: 90rpx;
		border-radius: 50rpx;
		text-align: center;
		line-height: 90rpx;
		margin: 76rpx auto 0 auto;
		background: $theme-color;
	}
	.popupBox{
		width:100%;
		height:400rpx;
		background:#fff;
		font-size:28rpx;
		border-radius: 10rpx 10rpx 0 0;
		.popupBoxTitle{
			width:100%;
			height:100rpx;
			line-height:100rpx;
			text-align:center;
			font-size:30rpx;
			color:#282828;
		}
		uni-input{
			width:90%;
			height:100rpx;
			border:1px solid #ccc;
			margin:0 auto;
			border-radius: 15rpx;
			padding:10rpx 20rpx;
			box-sizing: border-box;
		}
	}
	.subAccountList .uni-checkbox-input.uni-checkbox-input-checked {
		border: 1px solid $theme-color !important;
		background-color: $theme-color !important;
		color: #fff !important
	}
</style>
